<template>
  <el-card>
    <el-row :gutter="10" class="mb10">
      <slot default></slot>
      <div style="float: right">
        <el-button type="primary" icon="elementSearch" class="ml10"
          >查询</el-button
        >
      
        <el-dropdown
          class="ml10"
          split-button
          type="primary"
          @click="onMoreBtnClick"
        >
          更多
          <template #dropdown>
            <el-dropdown-menu>
                <el-dropdown-item icon="elementRefresh">重置</el-dropdown-item>
              <el-dropdown-item>待扩展1</el-dropdown-item>
              <el-dropdown-item>待扩展2</el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </div>
    </el-row>
    <el-row class="" :gutter="10">
      <slot name="more" v-if="state.moreEnable"> </slot>
    </el-row>
  </el-card>
</template>

<script lang="ts" setup>
import { ref, reactive, defineProps, getCurrentInstance } from "vue";

const { proxy } = getCurrentInstance() as any;

const props = defineProps({
  export: {
    type: Boolean,
    default: true,
  },
});
const state = reactive({
  moreEnable: false,
});

const onMoreBtnClick = () => {
  state.moreEnable = !state.moreEnable;
  proxy.$emit("search", "123");
};
</script>

